<script lang="ts" setup>
import { ref } from 'vue';

interface Props {
	items: any[];
	height?: number;
}

defineProps<Props>();

const current = ref(0);

const handleChange = (e: any) => {
	current.value = e.detail.current;
};
</script>

<template>
	<view class="x-swiper">
		<swiper :style="`height: ${height}rpx`" class="swiper" @change="handleChange" v-if="items.length > 1">
			<swiper-item :key="key" v-for="(item, key) in items">
				<x-image :src="item.url" width="100%" mode="widthFix" />
			</swiper-item>
		</swiper>
		<view v-else-if="items.length === 1">
			<x-image :src="items[0].url" width="100%" mode="widthFix" />
		</view>
	</view>
</template>
